<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>首媒-锁屏</title>
<meta name="keywords" content="首媒后台主题,响应式后台">
<meta name="description" content="首媒是Bootstrap3，使用了Html5+CSS3等现代技术">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
<meta http-equiv="expires" content="Wed, 26 Feb 209908:21:57 GMT"> 
<link rel="shortcut icon" href="favicon.ico">     
<link href="${ctx}/static/css/bootstrap.min.css?v=" rel="stylesheet">
<link href="${ctx}/static/css/font-awesome.min.css?v=" rel="stylesheet">
<link href="${ctx}/static/css/animate.min.css?v=" rel="stylesheet">
<link href="${ctx}/static/css/style.min.css?v=" rel="stylesheet">
<link href="${ctx}/static/css/login.min.css" rel="stylesheet">
<link href="${ctx}/static/css/common.css" rel="stylesheet" />
<link href="${ctx}/static/css/swiper.min.css" rel="stylesheet" />

<script src="${ctx}/static/js/jquery.min.js?v="></script> 
<script src="${ctx}/static/js/swiper.min.js?v="></script>   
<script>if(window.top !== window.self){ window.top.location = window.location;}</script>
<style type="text/css">
body.signin{ height:100%; width: 100%; background: url(${ctx}/static/img/bg000001.png) no-repeat center 50%/cover;}
.swiper-slide{text-align: center;font-size: 18px;background: none;/* Center slide text vertically*/display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.swiper-pagination-bullet{width:30px; height: 4px; border-radius: 4px; background: #999}
.swiper-pagination-bullet-active{ background: #f63}
.signinpanel form{ background: url(${ctx}/static/img/login-formbg.png) no-repeat center center/130% auto; padding: 30px 30px 60px;}
.signinpanel .btn{margin-top:35px;}
	.img-circle{width: 100px; height: 100px; border: 5px solid #f7f7f7; display: block;margin:0 auto;}

</style>
<script>
var ctx="${ctx}";
</script>
</head>

<body class="fixed-sidebar full-height-layoutg fixed-nav boxed-layout signin">

  <!--顶部导航开始-->
        <div class="row border-bottom topmenu">
                <nav class="navbar navbar-fixed-top" role="navigation" style="margin-bottom: 0; border-bottom:1px solid #e7e7e7;">
                    <div class="navbar-header">
                        <form role="search"  class="navbar-form-custom" method="post" action="">
                            <div class="form-group">
                              <a href="#" style="padding-left:50px; display:block"><img src="${ctx}/static/img/logo.png" style="height:37px; margin-top:10px;" /></a>
                            </div>
                        </form>
                    </div>
                    <ul class="nav navbar-top-links navbar-right">
                        
                        <li class="hidden-xs">
                            <a href="index_v1.html" class="J_menuItem" data-index="0"><i class="fa fa-question-circle"></i>帮助中心</a>
                        </li>
                         <li class="dropdown hidden-xs">
                            <a class="right-sidebar-toggle" aria-expanded="false">
                               <i class="fa fa-book" aria-hidden="true"></i>使用手册
                            </a>
                        </li>
                      
                    </ul>
                </nav>
            </div>
        <!--顶部导航结束end-->


    <div class="signinpanel">
        <div class="row">
            <div class="col-sm-7">
                <div class="signin-info">
                
                 <!-- Swiper -->
    <div class="swiper-container">
        <div class="swiper-wrapper">

            <div class="swiper-slide"><img src="${ctx}/static/img/banner1.png" /></div>
            <div class="swiper-slide"><img src="${ctx}/static/img/banner2.png" /></div>
            <div class="swiper-slide"><img src="${ctx}/static/img/banner3.png" /></div>
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
    </div>
                
<!--                    <h4><img src="${ctx}/static/img/loginpic.png" /></h4>-->
                </div>
            </div>
            <div class="col-sm-5">
                <!--锁屏输入密码-->
               
						<form action="${ctx}/login" method="post" role="form" class="login-form-sm animated fadeInDown"
							novalidate="true">
							<img alt="image" class="img-circle circle-border" src="${ctx}/static/img/logo.jpg"  width="200" height="200">
							<h4 class="no-margins text-center">请输入锁屏密码</h4>
                   <label id="alertInfo" class="control-label red-check"></label>
                    <input type="hidden" name="username" value="${mob}">
                    <input type="password" name="password" value="${password }" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"  id="password" class="form-control pword m-b" placeholder=""  required="">
                   
                    <button type="submit"  class="btn btn-primary btn-block">登  录</button>  
                    <p class="text-muted text-center" style="margin-top: 10px;"><a href="${ctx}/login"><small>重新登录？</small></a></p>         
						</form>
	
		
                <!--找回密码信息end-->
                
                <div class="error_info">${error_info}</div>
            </div>
        </div>
        <div class="signup-footer">
            <div class="pull-left">
                &copy; Smedia 2016-2017 All Rights Reserved. 
            </div>
        </div>
    </div>



<script>
var swiper = new Swiper('.swiper-container', {
	pagination: '.swiper-pagination',
	paginationClickable: true,
	   autoplay : 4000,
	   loop : true,
//	effect : 'cube',
//		cube: {
//		  slideShadows: false,
//		  shadow: false,
//		  shadowOffset: 100,
//		  shadowScale: 0.6
//		}
});
</script>
<script src="${ctx}/static/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctx}/static/js/bootstrap.min.js?v=3.3.5"></script>
<script src="${ctx}/static/js/cookie.js?v=3.3.5"></script>
<script>
    $(function(){
	 $(".gray-bg").keydown(function(event){if (event.keyCode==13)submitForm();});
	})
    
	$('#password').bind('input propertychange', function() {
		$("#alertInfo").html("");
	}); 
    
  	cookie("locaked",true,3600000);
	/* var submitForm=function(){
		$.ajax({
		    type: 'POST',
		    url: "${ctx}/login",
		    data: {
		    	username:$("#mob").val(),
		    	password:$("#password").val()
		    } ,
		    dataType: "json",
		    success:function(data){
		    	if(data.code==0){
		    		cookie("locaked",false);
		    		window.location.href="${ctx}/index";
		    	}else if(data.code==5){
		    		$("#alertInfo").html("用户不存在或用户名错误.请重试");
				}else if(data.code==3){
					$("#alertInfo").html("用户密码错误.请重试");
		    	}
		    }
		});
	} */
	</script>
</body>
</html>